<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<div class="t">
<div class="one">
    <p style="color: rgb(181, 24, 134); margin: 40px 30px; font-weight: bold;">...........................................................................</p>
</div>
</div>
<div id="o" class="b">
  <a href="#" id="about">about</a>
  <a href="#" id="blog">blog</a>
  <a href="#" id="projects">projects</a>
  <a href="#" id="contact">contact</a>
</div>
    <body>
    <img src="file:///C:/Users/fb/Desktop/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20250227130255.jpg" class="img"></img>
    <span style="cursor:auto">auto</span><br>
    <span style="cursor:crosshair">crosshair</span><br>
    <span style="cursor:default">default</span><br>
    <span style="cursor:e-resize">e-resize</span><br>
    <span style="cursor:help">help</span><br>
    <span style="cursor:move">move</span><br>
    <span style="cursor:n-resize">n-resize</span><br>
    <span style="cursor:ne-resize">ne-resize</span><br>
    <span style="cursor:nw-resize">nw-resize</span><br>
    <span style="cursor:pointer">pointer</span><br>
    <span style="cursor:progress">progress</span><br>
    <span style="cursor:s-resize">s-resize</span><br>
    <span style="cursor:se-resize">se-resize</span><br>
    <span style="cursor:sw-resize">sw-resize</span><br>
    <span style="cursor:text">text</span><br>
    <span style="cursor:w-resize">w-resize</span><br>
    <span style="cursor:wait">wait</span><br>
</body>
<style>
    #o a{
    position: absolute;
    left: -80px;
    transition: 0.3s;
    padding: 15px;
    width: 100px;
    text-decoration: none;
    font-size: 20px;
    color: white;
    border-radius: 0 5px 5px 0;
    }
    #o a:hover {
    left: 0;
}
    #about {
    top: 20px;
    background-color: #4CAF50;
}
    #blog {
    top: 80px;
    background-color: #2196F3;
}

    #projects {
    top: 140px;
    background-color: #f44336;
}

    #contact {
    top: 200px;
    background-color: #555
}
    .t{
        background: url(file:///C:/Users/fb/Desktop/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20250227130255.jpg)repeat;
    }
    .one{
        width: 700px;
        height: 500px;
        background-color: aquamarine;
        border: 2px solid yellow;
        opacity: 0.6;
    }
    .img{
        opacity: 0.2;
    }
    .img:hover{
        opacity: 1;
    }
</style>
<video width="400" controls>
    <source src="C:\Users\fb\Desktop\bisul\06719faabbd261f0e134309536dbc684.mp4" type="video/mp4">
    <source src="C:\Users\fb\Desktop\bisul\06719faabbd261f0e134309536dbc684.ogg" type="video/ogg">
    Your browser does not support HTML5 video.
  </video>
</html>